<!DOCTYPE html>
<html lang="en">
<head>
    <title>Matrix Admin</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <!--css-->
    <link rel="stylesheet" href="../resource/css/bootstrap.min.css" />
    <link rel="stylesheet" href="../resource/css/bootstrap-responsive.min.css" />
    <link rel="stylesheet" href="../resource/css/jquery.dataTables.min.css" />
    <link rel="stylesheet" href="../resource/css/fullcalendar.css" />
    <link rel="stylesheet" href="../resource/css/matrix-style.css" />
    <link rel="stylesheet" href="../resource/css/matrix-media.css" />
    <link href="../resource/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link rel="stylesheet" href="../resource/css/jquery.gritter.css" />

</head>
<body>
<div id="skyAlert" class="model fade" tabindex="2" style="z-index: 1044" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">信息</h4>
            </div>
            <div class="modal-body modal-body-skyalert">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>

<div id="skyConform" class="model fade" tabindex="1" style="z-index: 1043" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">信息</h4>
            </div>
            <div class="modal-body modal-body-skyconform">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" id="skyConformY">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<div id="skyWindow" class="model fade" tabindex="-1" style="z-index: 1042" role="dialog">
    <div class="modal-dialog skyModal" role="document">
        <div class="modal-content">
            <div class="modal-body modal-body-skyWindow">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" id="skyWinY">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal" id="skyWinN">取消</button>
            </div>
        </div>
    </div>
</div>

<!--Header-part-->
<div id="header">
    <img src="../resource/img/logo1.png" style="width: 120px;height: 75px;">
</div>

<!--头部导航菜单-->
<div id="user-nav" class="navbar navbar-inverse">
    <ul id="headerMenu"></ul>
</div>
<div id="welcome">欢迎您 <span id="wel_user"></span></div>

<div class="setting-skin">
    <i id="change" class="icon icon-caret-left icon-3x"></i>
    <div id="rightSide">
        <!--退出系统-->
        <a id="logout" href="/mylogout">
            <div style="text-align: center">
                <i class="icon-off"></i>
            </div>
            <div style="margin-top: 8px">
                <span>退出系统</span>
            </div>
        </a>
        <!--用户信息-->
        <a id="userInfo">
            <div style="text-align: center">
                <img src="resource/img/32/business-contact.png">
            </div>
            <div style="margin-top: 8px">
                <span>个人信息</span>
            </div>
        </a>
        <!--修改密码-->
        <a id="changePsd">
            <div style="text-align: center">
                <img src="resource/img/32/config.png">
            </div>
            <div style="margin-top: 8px">
                <span>修改密码</span>
            </div>
        </a>
        <!--更换皮肤-->
        <a id="changeSkin">
            <div style="text-align: center">
                <img src="resource/img/32/delicious.png">
            </div>
            <div style="margin-top: 8px">
                <span>更换皮肤</span>
            </div>
        </a>

        <!--查看记录-->
        <a id="showRecode">
            <div style="text-align: center;">
                <img src="resource/img/32/search.png">
            </div>
            <div style="margin-top: 8px">
                <span>查看记录</span>
            </div>
        </a>

        <!--显示时间-->
        <a id="showTime">
            <div style="text-align: center;">
                <!--<i class="icon-calendar"></i>-->
                <img src="resource/img/32/date.png">
            </div>
            <div style="margin-top: 8px">
                <span>显示时间</span>
            </div>
        </a>
    </div>
</div>

<!--侧边栏菜单-->
<div class="sidebar_fix">
    <div id="sidebar">
        <ul id="sidebarMenu">
        </ul>
    </div>
</div>

<!--sidebar-menu-->

<!--内容部分-->
<div id="content"></div>

<script src="../resource/js/jquery.min.js"></script>
<script src="../resource/js/jquery.cookie.js"></script>
<script src="../resource/js/bootstrap.min.js"></script>
<script src="../resource/vendor/echarts/dist/echarts.min.js"></script>
<script src="../resource/vendor/echarts/theme/vintage.js"></script>
<script src="../resource/vendor/echarts/map/js/china.js"></script>
<script src="../resource/js/jquery.dataTables.min.js"></script>
<script src="../resource/js/jquery.dataTables.bootstrap.js"></script>
<script src="../resource/js/jquery.dataTables_ext.js"></script>
<script src="../js/base.js"></script>
<script src="../js/form.util.js"></script>
<script src="../js/config.js"></script>
<script src="../js/index.js"></script>
<script>
    var flag=false;
    /*<i id="change" class="icon icon-caret-right icon-3x"></i>*/
    $('#change').click(function(){
        $("#rightSide").css("display","block")
        if(flag){
            $('.setting-skin').animate({right:"-120px"},500);
            $('#change').attr('class','icon icon-caret-left icon-3x');
        }else {
            $('.setting-skin').animate({right:"0"},500);
            $('#change').attr('class','icon icon-caret-right icon-3x');
        }
       flag=!flag;
    });
</script>
</body>
</html>
